<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>

<!DOCTYPE html>
<html>
<head>
	<title>阿玛尼护肤造型</title>
	<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
	<meta name="format-detection" content="telephone=no">
	<meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0,user-scalable=no">
	<meta name="apple-mobile-web-app-capable" content="yes">
	<meta name="apple-mobile-web-app-status-bar-style" content="black">
	<link rel="stylesheet" type="text/css" media="screen" href="${ROOT_PATH}content/scripts/bootstrap/css/bootstrap.min.css">
	<link rel="stylesheet" type="text/css" media="screen" href="${ROOT_PATH}content/css/ratchet.min.css?v=1.7">
	<link rel="stylesheet" type="text/css" media="screen" href="${ROOT_PATH}content/css/storefront.css">
	<script src="${ROOT_PATH}content/scripts/jquery-1.10.1.min.js"></script>
	<script src="${ROOT_PATH}content/scripts/juery.hammer.js"></script>
	<script src="${ROOT_PATH}content/scripts/bootstrap/js/bootstrap.min.js"></script>
	<script src="${ROOT_PATH}content/scripts/artDialog/jquery.artDialog.js?skin=aero"></script>
	<script src="${ROOT_PATH}content/scripts/artDialog/artDialog.iframeTools.js"></script>
	<script src="${ROOT_PATH}content/scripts/public.js"></script>
</head>
<body>
	<section>
		<div class="container-fluid" style="color: white;">
			<div class="row" style="margin-top: 40px;">
				<div class="col-xs-4">预约项目</div>
				<div class="col-xs-8">${order.projectname}</div>
			</div>
			<div class="row" style="margin-top: 20px;">
				<div class="col-xs-4">预约时间</div>
				<div class="col-xs-8">${order.orderfactdate}&nbsp;${order.orderfacttime}</div>
			</div>
			<div class="row" style="margin-top: 40px;">
				<div class="col-xs-4">理发师</div>
				<div class="col-xs-8">${order.staffname}</div>
			</div>
			<div class="row" style="margin-top: 20px;">
				<div class="col-xs-4">联系电话</div>
				<div class="col-xs-8">${order.orderphone}</div>
			</div>
			<div class="row" style="margin-top: 20px;">
				<div class="col-xs-4">门店地址</div>
				<div class="col-xs-8">${order.address}</div>
			</div>
			<c:if test="${order.orderstate ne '3.0'}">
				<div class="col-xs-12 text-center" style="padding: 10px 0;margin-top: 100px;">
					<button class="btn btn-outlined">取消预约</button>
				</div>
			</c:if>
		</div>
	</section>
	<script type="text/javascript">
		$(function(){
			$("button").click(function(){
				var _dialog = art.dialog({
				    content: '确定取消订单？',
				    button: [{
				            name: '确定',
				            callback: function () {
				            	_dialog.close();
				            	$.post('${ROOT_PATH }UCenter/canceOrder', {strBillId:'${order.callbillid}'}, function (data){
				                	if(data){
				                		altTip("订单取消成功！", 'error', function () {});
				                 	}else{
				                 		altTip("订单取消失败！请重试。", 'error', function () {});
				                 	}
				                });
				                return false;
				            },
				        },
				        {name: '取消'}
				    ],
			        lock: true
				});
			});
		});
	</script>
</body>
</html>